<template>
  <div :v-if="isViews">
    <el-card >
      <el-empty description="可以充值会员，增加你的曝光度" v-if="isNull"></el-empty>
      <el-row v-if="!isNull">
        <el-col span="4">
          <div>
            <el-avatar :src="user.icon"></el-avatar>
          </div>
        </el-col>
        <el-col span="15">
          <b style="float: left">{{user.nickName}}</b><br><br>
          <i style="float: left">{{user.province + '-' + user.city + '-' +  user.county}}</i>
        </el-col>

        <el-col span="5">
          <el-button type="primary" round v-if="!value"  @click="concern()">关注</el-button>
          <el-button type="info" round  v-if="value" @click="concern()">已关注</el-button>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>

<script>
import {concern, getUser} from "@/api/api";

export default {
  name: "User_list",
  props:['userID'],
  data(){
    return{
        user:{},
        isViews:false,
        isNull:true,
        value:true,
    }
  },
  methods: {
    /*点关注*/
    concern(){
      concern(this.user.id).then((res)=>{
        if(res.data.status === 200){
          this.value = !this.value;
        }
      })
    }
  },
  created() {
    if(this.userID === null){

    }else{
      getUser(this.userID).then((res)=>{
        if(res.data.status === 200){
          this.user = res.data.data;
          this.value = this.user.concern;
          this.isViews = true;
          this.isNull = false;
        }
      })
    }
  }
}
</script>

<style scoped>

</style>